{% extends 'base.html' %}

{% block title %}学术论文润色{% endblock %}

{% block content %}
    <style>
        /* 复用 index.html 的样式变量 */
        :root {
            --primary-blue: #524eef;
            --text-gray: #6D6D6D;
            --accent-yellow: #FFF8E5;
            --accent-purple: #E8E6F9;
        }
        .container my-4{
            margin:auto;
            max-width:80%;
        }
        body {
            background: -webkit-linear-gradient(top,
                    #ffffff 0%,
                    #fffede 33%,
                    #cdccff 66%,
                    #524eef 100%);
            background: linear-gradient(to bottom,
                    #ffffff 0%,
                    #fffede 33%,
                    #cdccff 66%,
                    #524eef 100%);
            min-height: 100vh;
            padding-bottom: 12%;
            margin:auto;
            max-width:80%;
        }

        .nlp-search-input {
            width: 100%;
            padding: 18px 60px 18px 30px;
            border: 2px solid var(--primary-blue);
            border-radius: 50px;
            font-size: 16px;
            color: var(--text-gray);
            background: rgba(255, 255, 255, 0.9);
        }

        /* 新增按钮样式，与 visualize.html 一致 */
        .nlp-btn {
            background: var(--primary-blue);
            color: white;
            border: none;
            border-radius: 20px;
            padding: 8px 25px;
            font-size: 16px;
            white-space: nowrap;
            cursor: pointer;
            transition: opacity 0.3s;
        }

        .nlp-btn:hover {
            opacity: 0.9;
        }
    </style>
    <div class="nlp-search-container">
        <h2 class="text-center mb-4">学术论文润色</h2>
        <div class="row justify-content-center">
            <div class="col-md-8">
                <form method="post" class="card p-4">
                    {% csrf_token %}
                    <div class="mb-3">
                        <textarea name="text" rows="10" class="nlp-search-input" placeholder="请输入需要润色的学术论文内容"></textarea>
                    </div>
                    <!-- 修改按钮类名，应用新样式 -->
                    <button type="submit" class="nlp-btn" style="margin-top:10%;">开始润色</button>
                </form>
                {% if result %}
                    <div class="card mt-4 p-4">
                        <h3>润色结果</h3>
                        <p>{{ result }}</p>
                    </div>
                {% endif %}
            </div>
        </div>
    </div>
{% endblock %}